﻿<div bsModal #createUserModal="bs-modal" class="modal fade" (onShown)="onShown()" tabindex="-1" role="dialog" aria-labelledby="createUserModal" aria-hidden="true" [config]="{backdrop: 'static'}">
    <div class="modal-dialog">

        <div #modalContent class="modal-content">

            <form *ngIf="active" #createUserForm="ngForm" novalidate (ngSubmit)="save()">

                <div class="modal-header">
                    <button type="button" class="close" (click)="close()" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title">
                        <span>{{l("CreateNewUser")}}</span>
                    </h4>
                </div>

                <div class="modal-body">
                    <div class="form-group form-float">
                        <div class="form-line">
                            <input class="form-control" type="text" name="UserName" [(ngModel)]="user.userName" required maxlength="32" minlength="2">
                            <label class="form-label">{{l("UserName")}}</label>
                        </div>
                    </div>
                    <div class="form-group form-float">
                        <div class="form-line">
                            <input type="text" name="Name" class="form-control" [(ngModel)]="user.name" required maxlength="32">
                            <label class="form-label">{{l("Name")}}</label>
                        </div>
                    </div>
                    <div class="form-group form-float">
                        <div class="form-line">
                            <input type="text" name="Surname" class="form-control" [(ngModel)]="user.surname" required maxlength="32">
                            <label class="form-label">{{l("Surname")}}</label>
                        </div>
                    </div>
                    <div class="form-group form-float">
                        <div class="form-line">
                            <input type="email" name="EmailAddress" class="form-control" [(ngModel)]="user.emailAddress" maxlength="256" pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{1,})+$">
                            <label class="form-label">{{l("EmailAddress")}}</label>
                        </div>
                    </div>
                    <div class="form-group form-float">
                        <div class="form-line">
                            <input type="password" name="Password" class="form-control" [(ngModel)]="user.password" required maxlength="32">
                            <label class="form-label">{{l("Password")}}</label>
                        </div>
                    </div>
                    <div class="checkbox">
                        <input type="checkbox" name="IsActive" value="true" id="CreateUserIsActive" [(ngModel)]="user.isActive" class="filled-in" checked />
                        <label for="CreateUserIsActive">{{l("IsActive")}}</label>
                    </div>
                </div>

                <div class="modal-footer">
                    <button [disabled]="saving" type="button" class="btn btn-default" (click)="close()">{{l("Cancel")}}</button>
                    <button type="submit" class="btn btn-primary blue" [disabled]="!createUserForm.form.valid">{{l("Save")}}</button>
                </div>

            </form>

        </div>
    </div>
</div>